<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>商城</title>
    <meta name="Keywords" content=""/>
    <meta name="description" content="" />
    <script src="js/mui.min.js" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/js/mui.min.js"></script>
    <link href="css/mui.min.css" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/css/mui.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="css/style.css" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/css/style.css" />
    <script type="text/javascript"> 
        !function(J){function H(){var d=E.getBoundingClientRect().width;var e=(d/7.5>100*B?100*B:(d/7.5<42?42:d/7.5));E.style.fontSize=e+"px",J.rem=e}var G,F=J.document,E=F.documentElement,D=F.querySelector('meta[name="viewport"]'),B=0,A=0;if(D){var y=D.getAttribute("content").match(/initial\-scale=([\d\.]+)/);y&&(A=parseFloat(y[1]),B=parseInt(1/A))}if(!B&&!A){var u=(J.navigator.appVersion.match(/android/gi),J.navigator.appVersion.match(/iphone/gi)),t=J.devicePixelRatio;B=u?t>=3&&(!B||B>=3)?3:t>=2&&(!B||B>=2)?2:1:1,A=1/B}if(E.setAttribute("data-dpr",B),!D){if(D=F.createElement("meta"),D.setAttribute("name","viewport"),D.setAttribute("content","initial-scale="+A+", maximum-scale="+A+", minimum-scale="+A+", user-scalable=no"),E.firstElementChild){E.firstElementChild.appendChild(D)}else{var s=F.createElement("div");s.appendChild(D),F.write(s.innerHTML)}}J.addEventListener("resize",function(){clearTimeout(G),G=setTimeout(H,300)},!1),J.addEventListener("pageshow",function(b){b.persisted&&(clearTimeout(G),G=setTimeout(H,300))},!1),H()}(window);
        if (typeof(M) == 'undefined' || !M){
            window.M = {};
        }
    </script>
</head>
<body>
	<header class="mui-bar mui-bar-nav shop-header" id="shortbar">
	    <a class="mui-action-back  mui-pull-left address">北京</a>
	    <h1 class="mui-title">
	    	<div class="mui-input-row mui-search">
	    	    <input type="search" class="mui-input-clear" placeholder="请输入要搜索的关键字">
	    	</div>
	    </h1>
	    <a class="mui-action-back mui-icon mui-pull-right"><i class="iconfont">&#xe6c2;</i></a>
	</header>
	<div id="slider" class="mui-slider" >
	  <div class="mui-slider-group mui-slider-loop">
	    <div class="mui-slider-item mui-slider-item-duplicate">
	      <a href="#">
	        <img src="images/banner.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/banner.jpg">
	      </a>
	    </div>
	    <div class="mui-slider-item">
	      <a href="#">
	        <img src="images/banner1.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/banner1.jpg">
	      </a>
	    </div>
	    <div class="mui-slider-item">
	      <a href="#">
	        <img src="images/banner.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/banner.jpg">
	      </a>
	    </div>
	    <div class="mui-slider-item">
	      <a href="#">
	        <img src="images/banner1.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/banner1.jpg">
	      </a>
	    </div>
	    <div class="mui-slider-item">
	      <a href="#">
	        <img src="images/banner.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/banner.jpg">
	      </a>
	    </div>
	    <div class="mui-slider-item mui-slider-item-duplicate">
	      <a href="#">
	        <img src="images/banner1.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/banner1.jpg">
	      </a>
	    </div>
	  </div>
	  <div class="mui-slider-indicator">
	    <div class="mui-indicator mui-active"></div>
	    <div class="mui-indicator"></div>
	    <div class="mui-indicator"></div>
	    <div class="mui-indicator"></div>
	  </div>
	</div>
	<div class="advantage">
		<a href=""><img src="images/adv.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/adv.jpg"/></a>
	</div>
	<ul class="nav">
		<li>
			<a href="">
				<img src="images/icon.png" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/icon.png" />
				<p>分类</p>
			</a>
		</li>
		<li>
			<a href="">
				<img src="images/icon1.png" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/icon1.png" />
				<p>清单</p>
			</a>
		</li>
		<li>
			<a href="">
				<img src="images/icon2.png" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/icon2.png" />
				<p>团购</p>
			</a>
		</li>
		<li>
			<a href="">
				<img src="images/icon3.png" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/icon3.png" />
				<p>店铺街</p>
			</a>
		</li>
		<li>
			<a href="">
				<img src="images/icon4.png" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/icon4.png" />
				<p>订单</p>
			</a>
		</li>
		<li>
			<a href="">
				<img src="images/icon5.png" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/icon5.png" />
				<p>拼团</p>
			</a>
		</li>
		<li>
			<a href="">
				<img src="images/icon6.png" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/icon6.png" />
				<p>资金</p>
			</a>
		</li>
		<li>
			<a href="">
				<img src="images/icon7.png" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/icon7.png" />
				<p>购物车</p>
			</a>
		</li>
		<li>
			<a href="">
				<img src="images/icon8.png" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/icon8.png" />
				<p>砍价</p>
			</a>
		</li>
		<li>
			<a href="">
				<img src="images/icon9.png" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/icon9.png" />
				<p>app下载</p>
			</a>
		</li>
	</ul>
	<div class="advantage">
		<a href=""><img src="images/a.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/a.jpg"/></a>
	</div>
	<ul class="pic">
		<li><a hhref=""><img src="images/14933579284363.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/14933579284363.jpg"/></a></li>
		<li><a hhref=""><img src="images/14933579338924.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/14933579338924.jpg"/></a></li>
	</ul>
	<ul class="photo">
		<li><a href=""><img src="images/14933579611488.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/14933579611488.jpg"/></a></li>
		<li><a href=""><img src="images/14933579671679.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/14933579671679.jpg"/></a></li>
		<li><a href=""><img src="images/14933579743170.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/14933579743170.jpg"/></a></li>
		<li><a href=""><img src="images/14933579781940.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/14933579781940.jpg"/></a></li>
	</ul>
	<h2 class="title"><img src="images/title.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/title.jpg"/></h2>
	<ul class="list">
		<li><a href=""><img src="images/1.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/1.jpg"/></a></li>
		<li><a href=""><img src="images/2.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/2.jpg"/></a></li>
		<li><a href=""><img src="images/3.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/3.jpg"/></a></li>
		<li><a href=""><img src="images/4.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/4.jpg"/></a></li>
	</ul>
	<ul class="small-pic">
		<li><a href=""><img src="images/5.JPG" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/5.JPG"/></a></li>
		<li><a href=""><img src="images/6.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/6.jpg"/></a></li>
		<li><a href=""><img src="images/7.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/7.jpg"/></a></li>
		<li><a href=""><img src="images/8.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/8.jpg"/></a></li>
	</ul>
	<h2 class="title"><img src="images/title1.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/title1.jpg"/></h2>
	<ul class="list">
		<li><a href=""><img src="images/14933685985825.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/14933685985825.jpg"/></a></li>
		<li><a href=""><img src="images/14933686034193.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/14933686034193.jpg"/></a></li>
		<li><a href=""><img src="images/14933686211869.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/14933686211869.jpg"/></a></li>
		<li><a href=""><img src="images/14933686276330.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/14933686276330.jpg"/></a></li>
	</ul>
	<ul class="small-pic">
		<li><a href=""><img src="images/14933688209563.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/14933688209563.jpg"/></a></li>
		<li><a href=""><img src="images/14933686642279.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/14933686642279.jpg"/></a></li>
		<li><a href=""><img src="images/14933686644650.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/14933686644650.jpg"/></a></li>
		<li><a href=""><img src="images/14933686646147.jpg" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/images/14933686646147.jpg"/></a></li>
	</ul>
	<div class="h50"></div>
	<nav class="mui-bar mui-bar-tab footer">
	    <a class="mui-tab-item mui-active" href="index.html" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/index.html">
	        <span class="mui-icon"><i class="iconfont">&#xe623;</i></span>
	        <span class="mui-tab-label">首页</span>
	    </a>
	    <a class="mui-tab-item" href="category.html" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/category.html">
	        <span class="mui-icon"><i class="iconfont">&#xe60a;</i></span>
	        <span class="mui-tab-label">分类</span>
	    </a>
	    <a class="mui-tab-item" href="shop.html" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/shop.html">
	        <span class="mui-icon"><i class="iconfont">&#xe612;</i></span>
	        <span class="mui-tab-label">附近商家</span>
	    </a>
	    <a class="mui-tab-item" href="shapcar.html" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/shapcar.html">
	        <span class="mui-icon"><i class="iconfont">&#xe63b;</i></span>
	        <span class="mui-tab-label">购物车</span>
	    </a>
	    <a class="mui-tab-item" href="member.html" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/member.html">
	        <span class="mui-icon"><i class="iconfont">&#xe600;</i></span>
	        <span class="mui-tab-label">我的</span>
	    </a>
	</nav> 
	<script type="text/javascript" src="js/jquery-1.10.1.min.js" tppabs="http://yanshi.sucaihuo.com/modals/31/3109/demo/js/jquery-1.10.1.min.js" ></script>
	<script>
		//链接跳转问题
		mui('body').on('tap', 'a', function() {
			document.location.href = this.href;
		});
        $(function () {
            var elm = $('#shortbar');
            var startPos = $(elm).offset().top;
            $.event.add(window, "scroll", function(){
                var p = $(window).scrollTop();
                if (p > startPos) {
                    elm.addClass('sortbar-fixed');
                }
                else {
                    elm.removeClass('sortbar-fixed');
                }
            });
        });

	</script>

</body>
</html>